<template>
	<view :class="[primarySize()]">
		<view class="container">
			<view class="ptb20 plr30">
				<view class="business_item flex-box" v-for="(item,index) in list">
					<view class="business_img">
						<image mode="aspectFit" :src="item.enterpriseinfo.logo"></image>
					</view>
					<view class="flex-grow-1 business_info">
						<view class="flex-box">
							<view class="fs32 col0 fd flex-grow-1 m-ellipsis pr30">{{item.job.job_name}}</view>
							<view class="col9">{{formatDatetime(item.createtime,'mm月dd日')}}</view>
						</view>
						<view class="flex-box">
							<view class="flex-grow-1">
								<view class="ptb10 放松2">{{item.job.city.shortname}} ｜ {{item.enterpriseinfo.full_name||item.enterpriseinfo.company_name}}</view>
								<view class="price">{{item.job.salary_text}}</view>
							</view>
							<view class="write" @click="bindCreateComment(index)">评价</view>
							
						</view>
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	const app = getApp();
	export default {
		data() {
			return {
				
				list: []
			}
		},
		onReady() {
			uni.setNavigationBarColor({
				frontColor: '#ffffff',
				backgroundColor: this.primaryColor()
			})
		},
		onLoad() {
			
			this.$core.get({url:'xilujob.interview_comment/not_comment_list',success:ret=>{
				this.list = ret.data;
			}});
		},
		methods: {
			bindCreateComment(index) {
			    let interview = this.list[index];
			    wx.navigateTo({
			      url: '/pages/user/appraise',
			      events: {
			        dataTransfer: data => {
			          let interview = data.interview;
			          for(let i=0;i<this.list.length;i++) {
			            if(this.list[i].id==interview.id) {
			              this.list.splice(i,1);
			              this.list = this.list;
			              break;
			            }
			          }
			          uni.$emit(app.globalData.Events.InterviewCommentAdd, {count: this.list.length});
			        }
			      },
			      success: res => {
			        res.eventChannel.emit('dataTransfer',{interview: interview});
			      }
			    });
			  }
		}
	}
</script>

<style lang="scss" scoped>
.business_item {
		position: relative;
		overflow: hidden;
		width: 690rpx;
		height: 190rpx;
		border-radius: 18rpx;
		border: 4rpx solid #FFFFFF;
		background: #FFFFFF;
		padding: 0 30rpx 0;
		margin-bottom: 20rpx;
	}

	.business_img {
		width: 80rpx;
		height: 80rpx;
		margin-right: 32rpx;
		
	}

	.business_img image {
		width: 100%;
		height: 100%;
		display: block
	}

	.business_info {
		font-size: 24rpx;
		color: #333
	}

	.cancel_star {
		font-size: 20rpx;
		color: #999;
		line-height: 39rpx;
		height: 39rpx;
		border-radius: 8rpx;
		border: 1rpx solid #E1E1E1;
		padding: 0 15rpx;
		float: left;
		margin-bottom: 13rpx;
		margin-right: 26rpx;
	}

	.star_type {
		float: left;
		font-size: 20rpx;
		color: #999;
		border-radius: 8rpx;
		line-height: 39rpx;
		height: 39rpx;
		padding: 0 17rpx;
		background-color: #F7F7F7;
		border: 1rpx solid #F7F7F7;
		margin-right: 13rpx;
		margin-bottom: 13rpx;
	}

	.price {
		font-size: 28rpx;
		color: var(--primary);
		&.alt{
			color: #F5584F;
		}
	}

	.refuse_btn {
		color: #999999;
		border: 1px solid #999999;
		font-size: 24rpx;
		padding: 0 24rpx;
		border-radius: 8rpx;
		height: 44rpx;
		line-height: calc(44rpx - 2px);
	}

	.agree_btn {
		color: var(--primary);
		border: 1px solid var(--primary);
		font-size: 24rpx;
		padding: 0 24rpx;
		border-radius: 8rpx;
		height: 44rpx;
		line-height: calc(44rpx - 2px);
	}


	.invite_item {
		line-height: 60rpx;
		font-size: 28rpx;
	}

	.invite_item view {
		align-self: flex-start
	}

	.invite_item view:nth-child(1) {
		width: 140rpx;
	}

	.invite_item view:nth-child(2) {
		color: #878787
	}

	.invite_item view:nth-child(3) {
		color: var(--primary)
	}
	.write{
		font-size: 28rpx;
		color: var(--primary);
		width: 152rpx;
		height: 52rpx;
		border-radius: 8rpx;
		border: 1px solid var(--primary);
		line-height: calc(52rpx - 2px);
		text-align: center;
	}
</style>
